<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="{{url_for('static',filename='js/jquery-3.6.1.js')}}" type="text/javascript" charset="utf-8"></script>
       <script>
                    $(function Summit() {
                    //var int = setInterval(function () {  //设置定时器

                        //console.log(document.getElementById('com1id1').innerHTML);
                        $("#Summit").on("click",function(event){
                            var table = document.getElementById("Table");
                            //var content = table.rows[2].cells[1].innerHTML;
                            //var content = table.rows[2].cells[3].innerHTML;
                            //console.log(content);
                            var data={/*"COM1":{ "ID1": , "ID2": ,"ID3": },
                                      "COM2":{ "ID1": , "ID2": ,"ID3": },
                                      "COM3":{ "ID1": , "ID2": ,"ID3": },
                                      "COM4":{ "ID1": , "ID2": ,"ID3": },
                                      "COM5":{ "ID1": , "ID2": ,"ID3": },
                                      "COM6":{ "ID1": , "ID2": ,"ID3": },
                                      "COM7":{ "ID1": , "ID2": ,"ID3": },
                                      "COM8":{ "ID1": , "ID2": ,"ID3": },
                                      "COM9":{ "ID1": , "ID2": ,"ID3": },
                                      "COM10":{ "ID1": , "ID2": ,"ID3": },
                                      "COM11":{ "ID1": , "ID2": ,"ID3": },
                                      "COM12":{ "ID1": , "ID2": ,"ID3": },
                                      "COM13":{ "ID1": , "ID2": ,"ID3": },
                                      "COM14":{ "ID1": , "ID2": ,"ID3": },
                                      "COM15":{ "ID1": , "ID2": ,"ID3": },
                                      "COM16":{ "ID1": , "ID2": ,"ID3": },
                                      "COM17":{ "ID1": , "ID2": ,"ID3": },
                                      "COM18":{ "ID1": , "ID2": ,"ID3": },
                                      "COM19":{ "ID1": , "ID2": ,"ID3": },
                                      "COM20":{ "ID1": , "ID2": ,"ID3": },
                                      "COM21":{ "ID1": , "ID2": ,"ID3": },
                                      "COM22":{ "ID1": , "ID2": ,"ID3": },
                                      "COM23":{ "ID1": , "ID2": ,"ID3": },
                                      "COM24":{ "ID1": , "ID2": ,"ID3": },
                                      "COM25":{ "ID1": , "ID2": ,"ID3": },
                                      "COM26":{ "ID1": , "ID2": ,"ID3": },
                                      "COM27":{ "ID1": , "ID2": ,"ID3": },
                                      "COM28":{ "ID1": , "ID2": ,"ID3": },
                                      "COM29":{ "ID1": , "ID2": ,"ID3": },
                                      "COM30":{ "ID1": , "ID2": ,"ID3": },
                                      "COM31":{ "ID1": , "ID2": ,"ID3": },
                                      "COM32":{ "ID1": , "ID2": ,"ID3": }*/
                                      };
                            var i,j;
                            var a;
                            var b;
                            var c={};
                            for(i=2;i<=33;i++){
                                a="COM"+(i-1);
                                for(j=1;j<=3;j++){
                                    b="ID"+j;
                                    //data[i-2]["ID"+j]=table.rows[i].cells[j].innerHTML;
                                    if(table.rows[i].cells[j].innerHTML!="")
                                        c[b]=table.rows[i].cells[j].innerHTML;
                                        //console.log(c[b]);

                                }
                                if(table.rows[i].cells[1].innerHTML!="")
                                data[a]=c,c={};
                                a="";
                                //console.log(data[a]);
                            }
                            console.log(data);

                           $.ajax(
                               {
                                   url:"/namedata", //从setData函数中获取数据
                                   type:"post",
                                   dateType:'json',
                                   //contentType : "application/json;charset=UTF-8",
                                   data:JSON.stringify(data),
                                   //dataType: "text",
                                    success:function(ret){
                                    }

                               }
                           )
                           window.location.href='{{url_for('a01')}}';
                        });
                    //},5000)
                    })
                $(function () {
                    //var int = setInterval(function () {  //设置定时器

                       $.ajax(
                           {
                               url:"/namedata", //从setData函数中获取数据
                               type:"get",
                               dateType:'json',
                                success:function(ret){
                                    var newData = JSON.stringify(ret);
                                    newData = eval("("+newData+")");
                                    //console.log(newData["COM1"])
                                    document.getElementById("com1id1").innerHTML=newData["COM1"]["ID1"];
                                    document.getElementById("com1id2").innerHTML=newData["COM1"]["ID2"];
                                    document.getElementById("com1id3").innerHTML=newData["COM1"]["ID3"];

                                    document.getElementById("com2id1").innerHTML=newData["COM2"]["ID1"];
                                    document.getElementById("com2id2").innerHTML=newData["COM2"]["ID2"];
                                    document.getElementById("com2id3").innerHTML=newData["COM2"]["ID3"];
                                }

                           }
                       )
                    //},10000)
                })
    </script>
    <table cellspacing="0" width="1500" border="1" id="Table">
        <tr>
            <th rowspan="2" width="100">ID</th>
            <th rowspan="2" width="250">探针ID-1位置名称</th>
            <th rowspan="2" width="250">探针ID-2位置名称</th>
            <th rowspan="2" width="250">探针ID-3位置名称</th>
            <th colspan="2" width="650">示例及说明</th>
        </tr>
        <tr align="center">
            <th>探针ID-1名称</th>
            <th>探针ID-2名称</th>
        </tr>
        <tr align="center">
            <td>1</td>
            <td contenteditable="true" id="com1id1">20汉字以内</td>
            <td contenteditable="true" id="com1id2">20汉字以内</td>
            <td contenteditable="true" id="com1id3">20汉字以内</td>
            <td rowspan="32" valign="top">转油二线上弯头</td>
            <td rowspan="32" valign="top">转油三线上弯头</td>
        </tr>
        <tr align="center">
            <td>2</td>
            <td contenteditable="true" id="com2id1"></td>
            <td contenteditable="true" id="com2id2"></td>
            <td contenteditable="true" id="com2id3"></td>
        </tr>
        <tr align="center">
            <td>3</td>
            <td contenteditable="true" id="com3id1"></td>
            <td contenteditable="true" id="com3id2"></td>
            <td contenteditable="true" id="com3id3"></td>
        </tr>
        <tr align="center">
            <td>4</td>
            <td contenteditable="true" id="com4id1"></td>
            <td contenteditable="true" id="com4id2"></td>
            <td contenteditable="true" id="com4id3"></td>
        </tr>
        <tr align="center">
            <td >5</td>
            <td contenteditable="true" id="com5id1"></td>
            <td contenteditable="true" id="com5id2"></td>
            <td contenteditable="true" id="com5id3"></td>
        </tr>
        <tr align="center">
            <td>6</td>
            <td contenteditable="true" id="com6id1"></td>
            <td contenteditable="true" id="com6id2"></td>
            <td contenteditable="true" id="com6id3"></td>
        </tr>
        <tr align="center">
            <td>7</td>
            <td contenteditable="true" id="com7id1"></td>
            <td contenteditable="true" id="com7id2"></td>
            <td contenteditable="true" id="com7id3"></td>
        </tr>
        <tr align="center">
            <td>8</td>
            <td contenteditable="true" id="com8id1"></td>
            <td contenteditable="true" id="com8id2"></td>
            <td contenteditable="true" id="com8id3"></td>
        </tr>
        <tr align="center">
            <td>9</td>
            <td contenteditable="true" id="com9id1"></td>
            <td contenteditable="true" id="com9id2"></td>
            <td contenteditable="true" id="com9id3"></td>
        </tr>
        <tr align="center">
            <td>10</td>
            <td contenteditable="true" id="com10id1"></td>
            <td contenteditable="true" id="com10id2"></td>
            <td contenteditable="true" id="com10id3"></td>
        </tr>
        <tr align="center">
            <td>11</td>
            <td contenteditable="true" id="com11id1"></td>
            <td contenteditable="true" id="com11id2"></td>
            <td contenteditable="true" id="com11id3"></td>
        </tr>
        <tr align="center">
            <td>12</td>
            <td contenteditable="true" id="com12id1"></td>
            <td contenteditable="true" id="com12id2"></td>
            <td contenteditable="true" id="com12id3"></td>
        </tr>
        <tr align="center">
            <td>13</td>
            <td contenteditable="true" id="com13id1"></td>
            <td contenteditable="true" id="com13id2"></td>
            <td contenteditable="true" id="com13id3"></td>
        </tr>
        <tr align="center">
            <td>14</td>
            <td contenteditable="true" id="com14id1"></td>
            <td contenteditable="true" id="com14id2"></td>
            <td contenteditable="true" id="com14id3"></td>
        </tr>
        <tr align="center">
            <td>15</td>
            <td contenteditable="true" id="com15id1"></td>
            <td contenteditable="true" id="com15id2"></td>
            <td contenteditable="true" id="com15id3"></td>
        </tr>
        <tr align="center">
            <td>16</td>
            <td contenteditable="true" id="com16id1"></td>
            <td contenteditable="true" id="com16id2"></td>
            <td contenteditable="true" id="com16id3"></td>
        </tr>
        <tr align="center">
            <td>17</td>
            <td contenteditable="true" id="com17id1"></td>
            <td contenteditable="true" id="com17id2"></td>
            <td contenteditable="true" id="com17id3"></td>
        </tr>
        <tr align="center">
            <td>18</td>
            <td contenteditable="true" id="com18id1"></td>
            <td contenteditable="true" id="com18id2"></td>
            <td contenteditable="true" id="com18id3"></td>
        </tr>
        <tr align="center">
            <td>19</td>
            <td contenteditable="true" id="com19id1"></td>
            <td contenteditable="true" id="com19id2"></td>
            <td contenteditable="true" id="com19id3"></td>
        </tr>
        <tr align="center">
            <td>20</td>
            <td contenteditable="true" id="com20id1"></td>
            <td contenteditable="true" id="com20id2"></td>
            <td contenteditable="true" id="com20id3"></td>
        </tr>
        <tr align="center">
            <td>21</td>
            <td contenteditable="true" id="com21id1"></td>
            <td contenteditable="true" id="com21id2"></td>
            <td contenteditable="true" id="com21id3"></td>
        </tr>
        <tr align="center">
            <td>22</td>
            <td contenteditable="true" id="com22id1"></td>
            <td contenteditable="true" id="com22id2"></td>
            <td contenteditable="true" id="com22id3"></td>
        </tr>
        <tr align="center">
            <td>23</td>
            <td contenteditable="true" id="com23id1"></td>
            <td contenteditable="true" id="com23id2"></td>
            <td contenteditable="true" id="com23id3"></td>
        </tr>
        <tr align="center">
            <td>24</td>
            <td contenteditable="true" id="com24id1"></td>
            <td contenteditable="true" id="com24id2"></td>
            <td contenteditable="true" id="com24id3"></td>
        </tr>
        <tr align="center">
            <td>25</td>
            <td contenteditable="true" id="com25id1"></td>
            <td contenteditable="true" id="com25id2"></td>
            <td contenteditable="true" id="com25id3"></td>
        </tr>
        <tr align="center">
            <td>26</td>
            <td contenteditable="true" id="com26id1"></td>
            <td contenteditable="true" id="com26id2"></td>
            <td contenteditable="true" id="com26id3"></td>
        </tr>
        <tr align="center">
            <td>27</td>
            <td contenteditable="true" id="com27id1"></td>
            <td contenteditable="true" id="com27id2"></td>
            <td contenteditable="true" id="com27id3"></td>
        </tr>
        <tr align="center">
            <td>28</td>
            <td contenteditable="true" id="com28id1"></td>
            <td contenteditable="true" id="com28id2"></td>
            <td contenteditable="true" id="com28id3"></td>
        </tr>
        <tr align="center">
            <td>29</td>
            <td contenteditable="true" id="com29id1"></td>
            <td contenteditable="true" id="com29id2"></td>
            <td contenteditable="true" id="com29id3"></td>
        </tr>
        <tr align="center">
            <td>30</td>
            <td contenteditable="true" id="com30id1"></td>
            <td contenteditable="true" id="com30id2"></td>
            <td contenteditable="true" id="com30id3"></td>
        </tr>
        <tr align="center">
            <td>31</td>
            <td contenteditable="true" id="com31id1"></td>
            <td contenteditable="true" id="com31id2"></td>
            <td contenteditable="true" id="com31id3"></td>
        </tr>
        <tr align="center">
            <td>32</td>
            <td contenteditable="true" id="com32id1"></td>
            <td contenteditable="true" id="com32id2"></td>
            <td contenteditable="true" id="com32id3"></td>
        </tr>

    </table>
    <center><button onclick=Summit() style="width:500px;height:50px;" id="Summit">提交</button></center>
</head>

<style>

</style>

</html>